<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
<f:view contentType="text/html">
	<h:head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<link rel="stylesheet"
			href="${request.contextPath}/resources/css/style.css" type="text/css"
			media="screen" />
		<link rel="stylesheet"
			href="${request.contextPath}/resources/css/styleButton.css"
			type="text/css" media="screen" />
		<link rel="shortcut icon"
			href="${request.contextPath}/resources/img/favicon.ico" />
		<title><ui:insert name="title"></ui:insert></title>
	</h:head>
	<h:body>
		<div id="page">
			<div id="menu">
				<ui:insert name="header">
					<center>
						<ui:include src="/template/commonHeader.xhtml" />
					</center>
				</ui:insert>
			</div>
			<div id="line" />
			<div id="content">
				<!-- List All User -->
				<h:form id="formListAllUser">
					<p:messages />
					<p:dataTable id="listDatatable" var="userList"
						value="#{userController.userList}"
						style="width:96%; padding-top: 3px; padding-bottom: 3px; padding-left: 2%;  vertical-align: top;"
						paginator="true" rows="20"
						paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
						paginatorPosition="bottom" rowsPerPageTemplate="10,20,40"
						emptyMessage="No User found with given criteria"
						draggableColumns="true" resizableColumns="true">

						<p:column headerText="USER NUMBER">
							<h:outputText value="#{userList.user_number}" />
						</p:column>

						<p:column headerText="ROLES"
							filterBy="#{userList.roles.description}"
							sortBy="#{userList.roles.description}">
							<h:outputText value="#{userList.roles.description}" />
						</p:column>

						<p:column headerText="STATUS" style="bottom:center; width:5%;"
							sortBy="#{userController.Status}">
							<p:commandLink action="#{userController.Status}"
								update=":formListAllUser:listDatatable">
								<h:graphicImage library="img"
									name="status_#{userList.status}.png" />
								<f:setPropertyActionListener target="#{userController.user}"
									value="#{userList}" />
							</p:commandLink>
						</p:column>

						<p:column headerText="EMAIL" sortBy="#{userList.email_r}">
							<h:outputText value="#{userList.email_r}" />
						</p:column>

						<p:column headerText="GENDER" sortBy="#{userList.sex}">
							<h:outputText value="#{userList.sex}" />
						</p:column>

						<p:column headerText="PASSWORD">
							<h:outputText value="#{userList.password}" />
						</p:column>

					</p:dataTable>
				</h:form>
			</div>
			<div id="line" />
			<br />
			<div id="footer">
				<ui:insert name="footer">
					<ui:include src="/template/commonDock.xhtml" />
				</ui:insert>
			</div>
		</div>
	</h:body>
</f:view>
</html>
